<template>
    <div class="main">
        <button @click="jiami">加密</button>
        <div class="content">
            <div class="data">
                <label class="layui-form-label">原token字符串</label>
                <div class="layui-input-block">
                    <textarea class="layui-textarea" v-model="token" style="width: 505px; height: 100px" />
                </div>
            </div>
            <div class="data">
                <label class="layui-form-label">AES方式加密：</label>
                <div class="layui-input-block">
                    <textarea class="layui-textarea" v-model="miwen" style="width: 505px; height: 100px" />
                </div>
            </div>
            <div class="data">
                <label class="layui-form-label">DES方式加密：</label>
                <div class="layui-input-block">
                    <textarea class="layui-textarea" v-model="desmw" style="width: 505px; height: 100px" />
                </div>
            </div>
            <div class="data">
                <label class="layui-form-label">sha256方式加密：</label>
                <div class="layui-input-block">
                    <textarea class="layui-textarea" v-model="sha256data" style="width: 505px; height: 100px" />
                </div>
            </div>
            <div class="data">
                <label class="layui-form-label">Base64方式加密：</label>
                <div class="layui-input-block">
                    <textarea class="layui-textarea" v-model="base64data" style="width: 505px; height: 100px" />
                </div>
            </div>
            <div class="data">
                <label class="layui-form-label">RC4方式加密：</label>
                <div class="layui-input-block">
                    <textarea class="layui-textarea" v-model="rc4data" style="width: 505px; height: 100px" />
                </div>
            </div>
            <div class="data">
                <label class="layui-form-label">hmacSHA512方式加密：</label>
                <div class="layui-input-block">
                    <textarea class="layui-textarea" v-model="hmacSHA512data" style="width: 505px; height: 100px" />
                </div>
            </div>
            <div class="data">
                <label class="layui-form-label">rabbit方式加密：</label>
                <div class="layui-input-block">
                    <textarea class="layui-textarea" v-model="rabbitdata" style="width: 505px; height: 100px" />
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import sha256 from "crypto-js/sha256";
import hmacSHA512 from "crypto-js/hmac-sha512";
import Base64 from "crypto-js/enc-base64";
import AES from "crypto-js/aes";
import { DES } from "crypto-js";
import CryptoJS from "crypto-js";

export default {
    data() {
        return {
            token:
                "eyJhbGciOiJIUzUxMiJ9.eyJ1c2VyX2lkIjoyNiwiZXhwIjoxNzIzNjY2NDgwLCJ1c2VyX2NvbXBhbnlfaWQiOjIyfQ.B-sA3kHcIqRk_SZmLcdkQnVKVmzSKfqFpoFZOS2GcX7zS3LY68HyUeSQC3pXPdjhO70_qYgj16_gUnK8ZzXGkw",
            t: new Date().getTime(),
            miwen: null,
            desmw: null,
            sha256data: null,
            base64data: null,
            rc4data: null,
            hmacSHA512data: null,
            rabbitdata: null,
        };
    },
    mounted() { },
    methods: {
        jiami() {
            // console.log('token',this.token)
            // console.log('t',this.t)
            this.pass(this.t + "lianxin", this.token + "::" + this.t);
            this.pass2(this.t + "lianxin", this.token + "::" + this.t);
            this.pass3(this.t + "lianxin", this.token + "::" + this.t);
            this.pass4(this.t + "lianxin", this.token + "::" + this.t);
            this.pass5(this.t + "lianxin", this.token + "::" + this.t);
            this.pass6(this.t + "lianxin", this.token + "::" + this.t);
            this.pass7(this.t + "lianxin", this.token + "::" + this.t);
        },
        pass(a, b) {
            const miwen = AES.encrypt(b, a).toString();
            this.miwen = miwen;
        },
        pass2(a, b) {
            const option = {
                mode: CryptoJS.mode.ECB,
                padding: CryptoJS.pad.Pkcs7,
            };
            const desmw = DES.encrypt(b, a, option).toString();
            this.desmw = desmw;
        },
        pass3(a, b) {
            this.sha256data = sha256(a + b).toString()
        },
        pass4(a, b) {//CryptoJS.enc.Base64.stringify(CryptoJS.enc.Utf8.parse(message))
            this.base64data = Base64.stringify(CryptoJS.enc.Utf8.parse(a + b))
        },
        pass5(a, b) {
            this.rc4data = CryptoJS.RC4.encrypt(b, a).toString();
        },
        pass6(a, b) {
            this.hmacSHA512data = hmacSHA512(b, a).toString()
        },
        pass7(a, b) {
            this.rabbitdata = CryptoJS.Rabbit.encrypt(b, a).toString()
        }
    },
};
</script>
<style scoped lang="scss">
.main {
    .content {
        display: flex;
        align-items: center;
        flex-direction: row;
        /* 设置主轴（y）居中显示 */
        justify-content: center;
        flex-wrap: wrap;
        width: 1100px;
        margin: 0 auto;

        .layui-form-label {
            float: left;
            display: block;
            padding: 9px 15px;
            padding-left: 0;
            font-weight: 400;
            line-height: 20px;
            text-align: right;
        }

        .layui-input-block {
            min-height: 36px;
        }

        .layui-input,
        .layui-textarea {
            display: block;
            width: 100%;
            padding-left: 10px;
        }
    }
}
</style>
